<template>
	<view>
		<text class="sc-lbl">{{name}}</text>
		<view class="sc-row">
			<input class="sc-text" v-model="code" :placeholder="place" />
			<button class="iconfont scan btn-scan" @click="sacn"></button>
		</view>
		<button @click="query">查询</button>
	</view>
</template>

<script>
	var that;
	export default {
		name: 'scan',
		props: {
			name: '',
		},
		data() {
			return {
				code: '',
			};
		},
		computed: {
			place() {
				return `请输入${this.name}`;
			}
		},
		methods: {
			query: function() {
				if (this.code.length <= 0) {
					this.util.showToast("请输入或者扫描条码")
					return;
				}
				this.$emit("onScan", {
					code: this.code
				})
			},
			sacn: function() {
				that = this;
				uni.scanCode({
					onlyFromCamera: true,
					success: function(res) {
						that.code = res.result;
					}
				});
			},
		}
	}
</script>

<style>
	.sc-row {
		width: 100%;
	}

	.sc-lbl {
		font-size: 32upx;
	}

	.sc-text {
		border: 1px solid rgba(0, 0, 0, .1);
		width: 80%;
		display: inline-block;
		padding: 10upx;
		height: 60upx;
	}

	.btn-scan {
		display: inline-block;
		width: 16%;
		height: 80upx;
		border-radius: 0px;
	}
</style>
